<div class="animated fadeInUp" style="padding:20px" ng-controller="app.welcome">
    <div class="well">
        {{message}}
    </div>
    <form>
        <tags-input ng-model="data.tags" display-property="name" placeholder="Add a country" replace-spaces-with-dashes="false" style="width:300px;">
            <auto-complete source="countries" min-length="0" load-on-focus="true" load-on-empty="true" max-results-to-show="32" template="my-custom-template"></auto-complete>
        </tags-input>
        <input ng-model="data.input" name="input" />
        {{data}}
    </form>
    <script type="text/ng-template" id="my-custom-template">
        <div>
        <span ng-bind-html="$highlight($getDisplayText())"></span>
        <span>({{data.rank}})</span>
        <span>{{data.confederation}}</span>
        </div>
    </script>
    <p ng-repeat="user in users">{{user.user}}</p>
</div>